<!-- 结决算管理-在综合查询中增加结导出功能 -->
<template>
  <el-container class="electronicSignature">
    <el-header height="36px">
      <header-title :title="$route.meta.title" />
    </el-header>
    <el-main class="mainDetails">
      <div>
        <SearchPanel title="查询条件" show-fold @setHeight="setHeight">
          <div ref="queryFormBox" class="search-flex-box">
            <MyForm
              ref="formRef"
              v-model="queryParams"
              :form-option="formOption"
              :select-list="dicLists"
              @handleEvent="handleEvent"
            />
            <div class="searchBtn">
              <el-button type="primary" class="pms-button-primary" @click="doSearch">查询</el-button>
              <el-button class="pms-button-primary" size="small" @click="dialogCheckbox = true">
                自定义列
              </el-button>
            </div>
          </div>
        </SearchPanel>
        <SearchList title="查询结果" style="margin-top: 16px">
          <template #header-btn>
            <BtnConfig ref="btnConfigRef" :btn-configs="btnOption" @propClick="btnClick" />
          </template>
          <template #body>
            <MyTable
              id="id"
              ref="myTableRef"
              :table-data="tableData"
              :columns="colOption"
              :col-option-enum="dicLists"
              :is-selection="false"
            />
            <pagination
              v-if="pageParam.total > 10"
              :total="pageParam.total"
              :page.sync="pageParam.pageNum"
              :limit.sync="pageParam.pageSize"
              @pagination="doSearch"
            />
          </template>
        </SearchList>
        <el-dialog
          v-dialogDrag
          title="列表字段配置"
          width="50%"
          :append-to-body="true"
          :modal-append-to-body="true"
          :modal="true"
          :close-on-click-modal="false"
          :lock-scroll="true"
          class="pms-dialog"
          :visible.sync="dialogCheckbox"
        >
          <div class="dialogCheckbox">
            <SetDynamics
              ref="customRef"
              :fixed-check-option="fixedCheckOption"
              :custom-check-option="customCheckOption"
              :span-clo="8"
            />
          </div>
          <div slot="footer" class="dialog-footer">
            <el-button class="pms-button-primary" size="small" @click="activeCustomCheck">确 定</el-button>
            <el-button class="pms-button-primary" size="small" @click="dialogCheckbox = false">取 消</el-button>
          </div>
        </el-dialog>
      </div>
    </el-main>
  </el-container>
</template>

  <script>
      import HeaderTitle from '@/components/basic/HeaderTitle'
      import SearchPanel from '@/components/basic/SearchPanel'
      import MyForm from '@/components/basic/myForm'
      import SearchList from '@/components/basic/SearchList'
      import MyTable from '@/components/basic/myTable'
      import SysConst from '@/common/const'
      import SetDynamics from '@/components/basic/setDynamics.vue'
      import BtnConfig from '@/components/basic/btnConfig.vue'
      import { getDropdownData } from '@/api/common' // 字典接口
      import { querySettPageList, getProvinceInfo, getCityInfo, getCountryInfo, settAsyncExport, querySettPageListCount } from '@/api/SettlementAndFinalAccounts/SettlementAndFinalAccountsExport/index' // 列表接口

      // 定义配置
      // 查询条件配置
      const formOption = {
          size: 'mini',
          inline: true,
          labelWidth: '160px',
          itemData: [
              {
                  type: 'input',
                  prop: 'prjName',
                  value: '',
                  width: '',
                  colSpan: 6,
                  clearable: true,
                  label: '项目名称'
              },
              {
                  type: 'input',
                  prop: 'prjCode',
                  value: '',
                  width: '',
                  colSpan: 6,
                  clearable: true,
                  label: '项目编码'
              },
              {
                  type: 'mulSelect',
                  prop: 'prjType',
                  value: '',
                  width: '',
                  colSpan: 6,
                  clearable: true,
                  label: '项目类型',
                  dicType: 'PROJ_TYPE',
                  dicProp: {
                      label: 'dictName',
                      value: 'dictId'
                  }
              },
              {
                  type: 'mulSelect',
                  prop: 'buildModes',
                  value: '',
                  width: '',
                  colSpan: 6,
                  label: '建设方式',
                  dicType: 'BUILD_MODES',
                  clearable: true,
                  dicProp: {
                      label: 'dictName',
                      value: 'dictId'
                  }
              },
              {
                type: 'mulSelect',
                prop: 'prjYear',
                value: new Date().getFullYear().toString(),
                width: '',
                colSpan: 6,
                label: '项目年份',
                dicType: 'PRJ_YEAR',
                clearable: true,
                dicProp: {
                label: 'dictName',
                value: 'dictId'
                }

            },
              {
                  type: 'select',
                  prop: 'provinceCode',
                  value: '',
                  width: '',
                  colSpan: 6,
                  clearable: true,
                  label: '所属省份',
                  disabled: false,
                  dicType: 'PROVINCE_DIC',
                  dicProp: {
                      label: 'AREANAME',
                      value: 'AREAID'
                  }
              },
              {
                  type: 'mulSelect',
                  prop: 'cityCode',
                  value: '',
                  width: '',
                  colSpan: 6,
                  clearable: true,
                  disabled: false,
                  label: '所属地市',
                  dicType: 'CITY_DIC',
                  dicProp: {
                      label: 'dictName',
                      value: 'dictId'
                  }
              },
              {
                  type: 'mulSelect',
                  prop: 'countyCode',
                  value: '',
                  width: '',
                  colSpan: 6,
                  clearable: true,
                  disabled: false,
                  label: '所属管理区域',
                  dicType: 'COUNTY_DIC',
                  dicProp: {
                      label: 'dictName',
                      value: 'dictId'
                  }
              },
              {
                  type: 'select',
                  prop: 'plType',
                  value: '',
                  width: '',
                  colSpan: 6,
                  label: '批量立项类型',
                  dicType: 'PL_TYPE',
                  clearable: true,
                  dicProp: {
                      label: 'dictName',
                      value: 'dictId'
                  }
              },
              {
                  type: 'select',
                  prop: 'isPl',
                  value: '',
                  width: '',
                  colSpan: 6,
                  label: '是否批量立项',
                  dicType: 'COF_YESORNO', // 跟 是否非标项目 用的同一字典
                  clearable: true,
                  dicProp: {
                      label: 'dictName',
                      value: 'dictId'
                  }
              },
              {
                  type: 'select',
                  prop: 'isPush',
                  value: '',
                  width: '',
                  colSpan: 6,
                  label: '结算送审状态',
                  dicType: 'JS_SSZT',
                  clearable: true,
                  dicProp: {
                      label: 'dictName',
                      value: 'dictId'
                  }
              },
              {
                  type: 'select',
                  prop: 'auditState',
                  value: '',
                  width: '',
                  colSpan: 6,
                  label: '结算审计状态',
                  dicType: 'AUDIT_STATE',
                  clearable: true,
                  dicProp: {
                      label: 'dictName',
                      value: 'dictId'
                  }
              },
              {
                  type: 'datePicker',
                  prop: 'internalAcceptDate',
                  dateType: 'daterange',
                  value: '',
                  width: '',
                  colSpan: 6,
                  label: '内部验收完成时间',
                  clearable: true,
                  format: 'yyyy-MM-dd',
                  valueFormat: 'yyyy-MM-dd'
              },
              {
                  type: 'datePicker',
                  prop: 'iverStartDataTime',
                  dateType: 'daterange',
                  value: '',
                  width: '',
                  colSpan: 6,
                  label: '实际交付时间',
                  clearable: true,
                  format: 'yyyy-MM-dd',
                  valueFormat: 'yyyy-MM-dd'
              },
              {
                  type: 'datePicker',
                  prop: 'returnTime',
                  dateType: 'daterange',
                  value: '',
                  width: '',
                  colSpan: 6,
                  label: '退回时间',
                  clearable: true,
                  format: 'yyyy-MM-dd',
                  valueFormat: 'yyyy-MM-dd'
              },
              {
                  type: 'select',
                  prop: 'returnType',
                  value: '',
                  width: '',
                  colSpan: 6,
                  label: '退回类型',
                  dicType: 'RETURN_TYPE',
                  clearable: true,
                  dicProp: {
                      label: 'dictName',
                      value: 'dictId'
                  }
              },
               {
                  type: 'datePicker',
                  prop: 'firstPushTime',
                  dateType: 'daterange',
                  value: '',
                  width: '',
                  colSpan: 6,
                  label: '首次送审时间',
                  clearable: true,
                  format: 'yyyy-MM-dd',
                  valueFormat: 'yyyy-MM-dd'
              },
              {
                  type: 'datePicker',
                  prop: 'pushTime',
                  dateType: 'daterange',
                  value: '',
                  width: '',
                  colSpan: 6,
                  label: '送审时间',
                  clearable: true,
                  format: 'yyyy-MM-dd',
                  valueFormat: 'yyyy-MM-dd'
              },
                {
                  type: 'select',
                  prop: 'is3Pro',
                  value: '',
                  width: '',
                  colSpan: 6,
                  label: '是否3万以上项目',
                  dicType: 'IS_3PRO',
                  clearable: true,
                  dicProp: {
                      label: 'dictName',
                      value: 'dictId'
                  }
              },
              {
                  type: 'select',
                  prop: 'ifModel',
                  value: '',
                  width: '',
                  colSpan: 6,
                  label: '是否模块化',
                  dicType: 'COF_YESORNO',
                  clearable: true,
                  dicProp: {
                      label: 'dictName',
                      value: 'dictId'
                  }
              },
              {
                  type: 'select',
                  prop: 'isNonstandard',
                  value: '',
                  width: '',
                  colSpan: 6,
                  label: '是否非标项目',
                  dicType: 'COF_YESORNO',
                  clearable: true,
                  dicProp: {
                      label: 'dictName',
                      value: 'dictId'
                  }
              },
              {
                  type: 'select',
                  prop: 'isRailway',
                  value: '',
                  width: '',
                  colSpan: 6,
                  label: '投资分类',
                  dicType: 'IS_RAILWAY',
                  clearable: true,
                  dicProp: {
                      label: 'dictName',
                      value: 'dictId'
                  }
              },
          ]
      }

      // 列表表头配置
      const colOption = [
          { label: '需求编码', width: '', prop: 'demandId' },
          { label: '项目编码', width: '', prop: 'prjCode' },
          { label: '项目名称', width: '', prop: 'prjName' },
          { label: '年份', width: '', prop: 'prjYear' },
          { label: '建设单位', width: '', prop: 'orgName' },
          { label: '建设方式', width: '', prop: 'buildModes', dicType: 'BUILD_MODES', dicProp: { label: 'dictName', value: 'dictId' }},
          { label: '内部验收时间', width: '', prop: 'internalAcceptDate' },
          { label: '实际交付时间', width: '', prop: 'deliverDate' },
          { label: '首次送审时间', width: '', prop: 'firstPushTime' },
          { label: '送审时间', width: '', prop: 'pushTime' },
          { label: '退回类型', width: '', prop: 'returnType', dicType: 'RETURN_TYPE', dicProp: { label: 'dictName', value: 'dictId' }},
          { label: '退审原因', width: '', prop: 'returnMsg' },
          { label: '退审时间', width: '', prop: 'returnData' }
      ]

      // 列表按钮配置
      const btnOption = [
          { label: '结算单导出', fun: 'derive', type: '' }
      ]

      const customCheckOption = [
          {
              prop: 'is3Pro',
              label: '是否3万以上项目',
              dicType: 'IS_3PRO', dicProp: { label: 'dictName', value: 'dictId' }
          },
          {
              prop: 'isRailway',
              label: '投资分类',
              dicType: 'IS_RAILWAY', dicProp: { label: 'dictName', value: 'dictId' }
          },
          {
              prop: 'isPl',
              label: '是否批量立项',
              dicType: 'COF_YESORNO', dicProp: { label: 'dictName', value: 'dictId' }
          },
          {
              prop: 'taskNodeName',
              label: '办理环节'
          },
          {
              prop: 'taskPerson',
              label: '办理人'
          },
          {
              prop: 'supplier',
              label: '未确认服务供应商'
          },
          {
              prop: 'isPush',
              label: '结算送审状态',
              dicType: 'JS_SSZT', dicProp: { label: 'dictName', value: 'dictId' }
          },
          {
              prop: 'auditState',
              label: '结算审计状态',
              dicType: 'AUDIT_STATE', dicProp: { label: 'dictName', value: 'dictId' }
          }
      ]
      export default {
          name: 'ElectronicSignature',
          components: {
              HeaderTitle,
              SearchPanel,
              SearchList,
              MyTable,
              MyForm,
            //   ChooseUnit,
              SetDynamics,
              BtnConfig
          },
          data() {
              return {
                  queryParams: {}, // 查询数据
                  formOption, // 查询条件配置项
                  tableData: [], // 列表数据
                  colOption, // 列表表头
                  btnOption, // 列表按钮
                  fixedCheckOption: colOption, // 固定字段
                  customCheckOption, // 自定义字段
                  dialogCheckbox: false, // 自定义列表弹框
                  dicLists: {}, // 下拉框字典选项集合
                  // 分页信息
                  pageParam: {
                      pageSize: SysConst.PAGESIZE, // 每页显示val条
                      pageNum: SysConst.CURRENT_PAGE, // 当前页
                      total: SysConst.TOTAL // 总数
                  },
                  // 省分
                  provinceCode: [],
                  // 地市
                  cityCode: [],
                  // 区县
                  countyCode: [],
                  urlList: {},
                  loginData: '', // 本地存储获取身份信息
                  loginDataId: '' // 本地存储获取身份信息ID
              }
          },
          created() {
              const urlVal = window.location.href
              this.urlList = this.GetRequest(urlVal)
              console.log(this.urlList, 'this.urlList')
              this.loginData = JSON.parse(sessionStorage.getItem('SET_LOGINDATA'))
              this.loginDataId = this.loginData ? this.loginData.workGroupId : ''
              this.$nextTick(() => {
                  this.setHeight(false)
              })
              this.getDictData()
              // 初始化省分
              this.getProvince()
          },
          mounted() {
              this.queryParams.provinceCode = this.urlList.province === 'zb' ? this.loginDataId : this.urlList.province
              this.queryParams.cityCode = this.urlList.city
              this.queryParams.countyCode = this.urlList.county
              this.queryParams.prjType = this.urlList.proType
              this.queryParams.buildModes = this.urlList.buildModes
              if (this.queryParams.provinceCode && this.queryParams.provinceCode !== 'zb') {
                  this.getCity(this.queryParams.provinceCode)
              }
            //   if (this.queryParams.provinceCode === 'zb') {
            //       this.doSearch()
            //   }
          },
          methods: {
             optimizeNewchangeData(val,type){
                    return val ? val[type] : ''
                },
              // 查看数据
                doSearch(item) {
                   if (!this.queryParams.provinceCode) {
                        this.$message.info('请先填写所属省分然后再查询')
                        return
                   }
                  const params = {
                      pageNum: item?.page || SysConst.CURRENT_PAGE,
                      pageSize: item?.limit || SysConst.PAGESIZE,
                      param: {
                        //   returnStartData: this.queryParams?.returnTime?.length ? this.queryParams.returnTime[0] : '',
                        //   returnEndData: this.queryParams?.returnTime?.length ? this.queryParams.returnTime[1] : '',
                        //   pushTimeStartData: this.queryParams?.pushTime?.length ? this.queryParams.pushTime[0] : '',
                        //   pushTimeEndData: this.queryParams?.pushTime?.length ? this.queryParams.pushTime[1] : '',
                        //   acceptStartData: this.queryParams?.internalAcceptDate?.length ? this.queryParams.internalAcceptDate[0] : '',
                        //   acceptEndData: this.queryParams?.internalAcceptDate?.length ? this.queryParams.internalAcceptDate[1] : '',
                        //   deliverStartData: this.queryParams?.iverStartDataTime?.length ? this.queryParams.iverStartDataTime[0] : '',
                        //   deliverEndData: this.queryParams?.iverStartDataTime?.length ? this.queryParams.iverStartDataTime[1] : '',
                          returnStartData: this.optimizeNewOne(this.queryParams?.returnTime?.length, this.optimizeNewchangeData(this.queryParams.returnTime,0)),
                          returnEndData: this.optimizeNewOne(this.queryParams?.returnTime?.length, this.optimizeNewchangeData(this.queryParams.returnTime,1)),
                          pushTimeStartData: this.optimizeNewOne(this.queryParams?.pushTime?.length, this.optimizeNewchangeData(this.queryParams.pushTime,0)),
                          pushTimeEndData: this.optimizeNewOne(this.queryParams?.pushTime?.length, this.optimizeNewchangeData(this.queryParams.pushTime,1)),
                          acceptStartData: this.optimizeNewOne(this.queryParams?.internalAcceptDate?.length, this.optimizeNewchangeData(this.queryParams.internalAcceptDate,0)),
                          acceptEndData: this.optimizeNewOne(this.queryParams?.internalAcceptDate?.length, this.optimizeNewchangeData(this.queryParams.internalAcceptDate,1)),
                          deliverStartData: this.optimizeNewOne(this.queryParams?.iverStartDataTime?.length, this.optimizeNewchangeData(this.queryParams.iverStartDataTime,0)),
                          deliverEndData: this.optimizeNewOne(this.queryParams?.iverStartDataTime?.length, this.optimizeNewchangeData(this.queryParams.iverStartDataTime,1)),
                          firstPushStartData:this.optimizeNewOne(this.queryParams?.firstPushTime?.length, this.optimizeNewchangeData(this.queryParams.firstPushTime,0)),
                          firstPushEndData:this.optimizeNewOne(this.queryParams?.firstPushTime?.length,this.optimizeNewchangeData(this.queryParams.firstPushTime,1)),
                          ...this.queryParams,
                          prjName: this.queryParams.prjName.trim(),
                          provinceCode: this.queryParams.provinceCode === 'zb' ? '' : this.queryParams.provinceCode,
                          orgId: this.queryParams.provinceCode === 'zb' ? this.loginDataId : ''
                      }
                  }
                  delete params.param.returnTime
                  delete params.param.pushTime
                  delete params.param.firstPushTime
                  delete params.param.internalAcceptDate
                  delete params.param.iverStartDataTime
                  this.optimizeNewTwo(params)
              },
              // 2024-9-26 阻断问题if过多解决方案
            optimizeNewOne(oldLength, data) {
                return oldLength ? data : ''
            },
             // 2024-9-26 阻断问题if过多解决方案
             optimizeNewTwo(params) {
                querySettPageList(params).then(res => {
                      if (+res.code !== 200) {
                        return Promise.reject(res)
                      }
                      this.tableData = res.data?.list
                    //   this.pageParam.total = res.data?.total || 0
                      this.pageParam.pageSize = res.data?.pageSize || SysConst.PAGESIZE
                      this.pageParam.pageNum = res.data?.pageNum || SysConst.CURRENT_PAGE
                  })
                  querySettPageListCount(params.param).then(res => {
                      if (+res.code !== 200) {
                        return Promise.reject(res)
                      }
                    //   this.tableData = res.data?.list;
                      this.pageParam.total = res.data
                    //   this.pageParam.pageSize = res.data?.pageSize || SysConst.PAGESIZE
                    //   this.pageParam.pageNum = res.data?.pageNum || SysConst.CURRENT_PAGE
                  })
            },
              // 查询条件事件
              handleEvent(prop, val) {
                  console.log(prop, val, 'hjhjbj')
                  if (prop === 'prjStatusNew') {
                      this.getPrjNodeName(val)
                      this.queryParams.prjNodeId = []
                  }
                  if (prop === 'isPl') {
                      this.isPlFun(val)
                  }
                  if (prop === 'plType') {
                      this.plTypeFun(val)
                  }
                  if (prop === 'provinceCode') {
                      this.getCity(val)
                  }
                  if (prop === 'cityCode') {
                      this.getCounty(val)
                  }
              },
              isPlFun(val) {
                  if (val === '0') {
                      this.queryParams.plType = ''
                  }
                  // const finAuditStateObject = this.dicLists['FIN_AUDIT_STATE'].find(v=>v.dictId == val)
                  // props.ifModel
                  // console.log(formOption.itemData.splice(13,1),'itemData')
                  // console.log(finAuditStateObject, '11111111')
              },
              plTypeFun(val) {
                  if (val) {
                      this.queryParams.isPl = '1'
                  }
              },
              // 列表按钮点击事件
              btnClick(fun, row) {
                  this[fun](row)
              },
              // 导出
              async derive(row) {
                if (!this.queryParams.provinceCode) {
                        this.$message.info('请先填写所属省分查询后,再进行导出')
                        return
                   }
                const params = {
                    returnStartData: this.queryParams?.returnTime?.length ? this.queryParams.returnTime[0] : '',
                    returnEndData: this.queryParams?.returnTime?.length ? this.queryParams.returnTime[1] : '',
                    pushTimeStartData: this.queryParams?.pushTime?.length ? this.queryParams.pushTime[0] : '',
                    pushTimeEndData: this.queryParams?.pushTime?.length ? this.queryParams.pushTime[1] : '',
                    acceptStartData: this.queryParams?.internalAcceptDate?.length ? this.queryParams.internalAcceptDate[0] : '',
                    acceptEndData: this.queryParams?.internalAcceptDate?.length ? this.queryParams.internalAcceptDate[1] : '',
                    deliverStartData: this.queryParams?.iverStartDataTime?.length ? this.queryParams.iverStartDataTime[0] : '',
                    deliverEndData: this.queryParams?.iverStartDataTime?.length ? this.queryParams.iverStartDataTime[1] : '',
                    firstPushStartData:this.queryParams?.firstPushTime?.length?this.queryParams.firstPushTime[0]:"",
                    firstPushEndData:this.queryParams?.firstPushTime?.length?this.queryParams.firstPushTime[1]:"",
                    ...this.queryParams,
                    prjName: this.queryParams.prjName.trim(),
                    provinceCode: this.queryParams.provinceCode === 'zb' ? '' : this.queryParams.provinceCode,
                    orgId: this.queryParams.provinceCode === 'zb' ? this.loginDataId : ''
                }
                delete params.returnTime
                delete params.pushTime
                delete params.firstPushTime
                delete params.internalAcceptDate
                delete params.iverStartDataTime
                settAsyncExport(params).then(res => {
                    if (+res.code !== 200) {
                        return Promise.reject(res)
                    }
                    this.$message.success(res.message)
                })
                querySettPageListCount
              },
              // 自定义列字段弹框-点击确认
              activeCustomCheck() {
                  const list = this.$refs.customRef.checkboxValue
                  this.colOption = [...colOption, ...list]
                  this.dialogCheckbox = false
              },
              // 获取下拉框数据
              async getDictData() {
                  const arr = ['PROJ_TYPE', 'BUILD_MODES', 'PL_TYPE', 'COF_YESORNO', 'IS_3PRO', 'JS_SSZT', 'AUDIT_STATE', 'RETURN_TYPE', 'IS_RAILWAY','PRJ_YEAR']
                  const promises = arr.map(item => getDropdownData(item))
                  const results = await Promise.all(promises)
                  arr.forEach((item, i) => {
                      this.$set(this.dicLists, item, results[i].data ?? [])
                  })
              },
              // 获取省分
              async getProvince() {
                  const res = await getProvinceInfo()
                  this.$set(this.dicLists, 'PROVINCE_DIC', res.data)
                   // 判断逻辑 参照综合查询(君南)
                  if (res.data.length === 1) {
                    console.log(formOption.itemData, 'formOption.itemDataformOption.itemData')
                      formOption.itemData[5].disabled = true
                      // this.queryParams.provinceCode = res.data[0].AREANAME
                      this.queryParams.provinceCode = res.data[0].AREAID
                      await this.getCity(res.data[0].AREAID) // 加载地市
                  } else if (this.loginData && this.loginData.groupType === 0) {
                    // 判断逻辑 参照综合查询(君南) 赋值有区别稍微变动
                    if (this.urlList.province === 'zb') {
                        this.dicLists.PROVINCE_DIC.unshift({ AREAID: 'zb', AREANAME: '总部' })
                        this.queryParams.provinceCode = 'zb' // 省分默认值
                    } else {
                        this.dicLists.PROVINCE_DIC.unshift({ AREAID: 'zb', AREANAME: '总部' })
                        const newAreaId = res.data.filter(item => { return item.AREAID === this.queryParams.provinceCode }) // 过滤地址栏的省份编码进行赋值
                        this.queryParams.provinceCode = newAreaId[0].AREAID
                        await this.getCity(newAreaId[0].AREAID) // 加载地市
                    }
                  } else {
                    console.log('[]')
                  }
              },
              // 获取地市
              async getCity(code) {
                  if (code) {
                      const params = {
                          provinceId: code
                      }
                      const res = await getCityInfo(params)
                      if (res.data.length <= 0) {
                          this.queryParams.cityCode = ''
                          this.queryParams.countyCode = ''
                          this.$set(this.dicLists, 'CITY_DIC', [])
                          this.$set(this.dicLists, 'COUNTY_DIC', [])
                          return
                      }
                      const cityDicList = res.data.map(item => ({
                          dictId: item.AREAID,
                          dictName: item.AREANAME
                      }))
                      this.$set(this.dicLists, 'CITY_DIC', cityDicList)
                      if (res.data.length === 1) {
                          formOption.itemData[6].disabled = true
                          this.queryParams.cityCode = res.data[0].AREAID
                          await this.getCounty(res.data[0].AREAID) // 加载管理区域
                      }
                  } else {
                      this.queryParams.cityCode = ''
                      this.$set(this.dicLists, 'CITY_DIC', [])
                  }
              },
              // 获取区县
              async getCounty(code) {
                  if (code) {
                      const params = {
                          cityId: code
                      }
                      const res = await getCountryInfo(params)
                      if (res.data.length <= 0) {
                          this.queryParams.countyCode = ''
                          this.$set(this.dicLists, 'COUNTY_DIC', [])
                          return
                      }
                      const countyDicList = res.data.map(item => ({
                          dictId: item.AREAID,
                          dictName: item.AREANAME
                      }))
                      this.$set(this.dicLists, 'COUNTY_DIC', countyDicList)
                  } else {
                      console.log('222')
                      this.queryParams.countyCode = ''
                      this.$set(this.dicLists, 'COUNTY_DIC', [])
                  }
              },
              // 获取url 携带参数
              GetRequest(url) {
                  var theRequest = {}
                  if (url.indexOf('?') !== -1) {
                      var str = url.substr(1)
                      var strs = str.split('?')
                      var strsList = strs[1].split('&')
                      for (var i = 0; i < strsList.length; i++) {
                          theRequest[strsList[i].split('=')[0]] = strsList[i].split('=')[1]
                      }
                  }
                  return theRequest
              },
              // 设置高度
              setHeight(isFold) {
                  const child = this.$refs.formRef.$refs
                  const height = (formOption.itemData.length / 3).toFixed() - 0
                  console.log(child, '🚗')
                  // const height = (child.queryFormRef.$children.length / 3).toFixed() - 0
                  this.$refs.queryFormBox.style.height = isFold ? `${height * 24}px` : '54px'
                  child.myFormRef.style.height = isFold ? `${height * 24}px` : '54px'
              }
          }
      }
  </script>

  <style lang="scss" scoped>
  .search-flex-box {
      // display: flex;
      // justify-content: space-between;
      height: auto;
  }
  .searchBtn {
      width: 100px;
      margin-left: auto;
      display: flex;
      margin-top: 4px;
      flex-direction: column;
      .el-button + .el-button {
          margin-left: 0;
          margin-top: 8px;
      }
  }

  .electronicSignature {
      width: 100%;
      .mainDetails {
          padding: 20px 25px 0px;
      }
      .topRemark {
          // background-color: #fdf5e6;
          background-color: #ffefd5;
          width: 100%;
          height: 40px;
          line-height: 40px;
          padding-left: 10px;
          font-size: 14px;

          .asterisk {
              color: #f00;
              margin-right: 2px;
              font-size: 18px;
          }
      }

      .customBtn {
          height: 20px;
          line-height: 20px;
          font-size: 14px;
          margin: 10px 20px 10px 90%;
          cursor: pointer;

          .el-icon-s-tools {
              font-size: 20px;
              color: #999;
              margin-right: 6px;
          }
      }
  }

  .el-button--text {
      color: #02A7F0;
  }

  .el-button--primary {
      color: #fff;
  }
  .dialog-footer {
      display: flex;
      justify-content: center;
  }
  ::v-deep .el-button + .el-button {
      color: #fff;
  }
  // 弹框样式
  ::v-deep .el-dialog__body {
      max-height: 400px;
      overflow-y: auto;
  }
  // 滚动条样式
  ::v-deep .el-dialog__body::-webkit-scrollbar {
  // 滚动条整体样式
  width: 6px; //高宽分别对应横竖滚动条的尺寸
  height: 10px;
  }
  ::v-deep .el-dialog__body::-webkit-scrollbar-thumb {
  // 滚动条里面小方块
  border-radius: 10px;
  // -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
  background: #f2f3f5;
  }
  ::v-deep .el-range-editor.el-input__inner {
      padding: 0px 10px;
  }
  </style>

